<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>

<link type="text/css" href="<%=basePath%>/css/oss/iot/head.css?<%=v%>" rel="stylesheet"/>

<div class="header">
	<div class="header-detail">
		<div class="menuList  isCN ">
			<a href="<%=basePath%>" class="logo"></a> 
			<span class="apart"></span> 
			<a href="<%=basePath%>/service/iot/index" class="menu" tag="home" title="首页">首页</a>
			
			<div class="menu multi " tag="monitor" >
			    <span>监控中心</span>
			    <ul>
			        <li><a href="<%=basePath%>/service/iot/monitor">设备监控</a></li>
			        <li><a href="<%=basePath%>/service/iot/mvideo">视频监控</a></li>
			    </ul>
			</div>
			
			<!--
			<a href="<%=basePath%>/service/iot/monitor" class="menu">监控中心</a>  
			-->	
			
			<a tag="alarm" href="<%=basePath%>/service/iot/alarm_manager" class="menu">报警信息</a>
			
			<c:if test="${user.type >7 }">
				<a tag="user" href="<%=basePath%>/service/iot/user_manager" class="menu">用户管理</a>
			</c:if>
			
			<a tag="history" href="<%=basePath%>/service/iot/history_sensor_data" class="menu">历史数据</a>

			<!-- 
			<div class="menu multi ">
			    <span class="active">历史数据</span>
			    <ul>
			        <li><a href="<%=basePath%>/service/iot/history_sensor_data">历史数据</a></li>
			        <li><a href="<%=basePath%>/service/iot/history_trigger_data" >触发历史</a></li>
			    </ul>
			</div>
			 -->
			
			<c:if test="${user.type >7 }">
				<div tag="manager" class="menu multi ">
				    <span>系统管理</span>
				    <ul>
				        <li><a href="<%=basePath%>/service/iot/app_manager" >项目管理</a></li>
				        <li><a href="<%=basePath%>/service/iot/video_manager" >视频管理</a></li>
				        <c:if test="${user.type == 10 }">
				        	<li><a href="<%=basePath%>/service/iot/device_template_manager" >设备型号</a></li>
				        </c:if>
				        <li><a href="<%=basePath%>/service/iot/gateway_manager" >设备列表</a></li>
				        <li><a href="<%=basePath%>/service/iot/sensor_manager" >传感信息</a></li>
				        <li><a href="<%=basePath%>/service/iot/trigger_manager" >触发管理</a></li>
				    </ul>
				</div>				
			</c:if>

			<c:if test="${user.type > 7}">
				<a href="<%=basePath%>/service/iot/home" target="_blank" class="menu">数据大屏</a>
			</c:if>
		</div>
		<div class="profile clearfix">
			<span class="border-alarm" onclick="forwardUrl('/iot/alarm_manager')">
				<span class="icon-bell-o"></span>  报警 <span class="badge bg-red-light alarm_num"></span>
			</span>
			<div class="profile-detail">
				<div class="profile-detail-img dropdown-hover">
					<img  alt="userImg" src="<%=basePath%>/image/oss/iot/default.jpg">
				</div>
				
				<ul class="profile-detail-ul" style="margin-top: 20px;display: none;">
                    <li class="first">
                    	 <c:if test="${user.nick_name !=null}">
						 	 ${user.nick_name }
						 </c:if>
						 <c:if test="${user.nick_name ==null}">
						 	 ${user.name}
						 </c:if>
                    </li>
                    <c:if test="${user.type == 10}">
                    	<li><a href="<%=basePath%>/service/oss"  target="_blank"><span class="icon-graduation-cap"></span>&nbsp;后台入口</a></li>
                    </c:if>
                    <li><a href="javascript:void(0);" onclick="showUserInfo()" target="_blank"><span class="icon-user"></span>&nbsp;个人资料</a></li>
                    <li class="last"><a href="<%=basePath%>/service/user/logout" ><span class="icon-power-off"></span>&nbsp;退出账号</a></li>
                </ul>
			</div>
		</div>
	</div>
	<div id="template-nodata" class="hide">
		<div class="no_data" style="height: {0}px;line-height: {0}px;">
			<img src="<%=basePath%>/image/oss/iot/no_data.png"> <span>暂无数据</span>
		</div>
	</div>
	
		<div style="padding:20px 40px;display: none;" type-option="form_submit" id="userInfoHeader" 
			  config-option="url:'/user/self', method :'put',
							  submit :'.modify-Btnx',
							  success:'sunccessRe' ">
				<div class="form-line">
					<span>用户名：</span>
					<div class="pb-10 pt-10">
						<span class="input input-big">${user.name}</span>
					</div>	
				</div>
				<div class="form-line">
					<span>用户类型：</span>
					<div class="pb-10 pt-10">
						<span class="input input-big">${user.data.type}</span>
					</div>
				</div>
				<div class="form-line relative">
					<span>API-KEY：</span>
					<div class="pb-10 pt-10">
						<span class="input input-big api-value"  >*****${fn:substring(user.user_key, 5, 25)}*****</span>
						<img class="eyeApiKey" style="position: absolute;top: 36px;right: 10px;cursor: pointer;" 
							onclick="showApiKey('${user.user_key}')"  src="<%=basePath%>/image/oss/iot/eye.png">						
					</div>
				</div>
				<div class="form-line">
					<span>手机号：</span>
					<div class="pb-10 pt-10">
						<input placeholder="手机号"  type-name="phone" value="${user.phone}" validate="phone:请输入正确的手机格式" class="input input-big" >
					</div>
				</div>
				<div class="form-line">
					<span>邮箱：</span>
					<div class="pb-10 pt-10">
						<input placeholder="邮箱"  type-name="email" value="${user.email}" validate="email:请输入正确的邮箱格式" class="input input-big" >
					</div>
				</div>
				<div class="form-line clearfix">
					<button onclick="closeAll();" class="button border-gray ml-10 button-big float-right">取消</button>
					<button class="modify-Btnx button ml-20 bg-iot button-big float-right">修改</button>
				</div>
		</div>
	
</div>

<!-- <div class="footer">
	<div class="copyright-intro" style="text-align: center;">
		<span>
			Copyright © 2019-2029&nbsp;小名智能科技 版权所有  <a style="color: #a4cde6; " target="_blank" href="http://www.beian.miit.gov.cn">苏ICP备18061586号</a>
		</span>
	</div>
</div> -->

<script>
	function sunccessRe(data){
		if(isOK(data)){
			tip("修改成功");
			setTimeout(function() {
				closeAll();
			}, 1000);
		}else{
			tip(data.statusMsg);
		}
	}
	function showUserInfo(){
		layer.open({
			  type: 1,
			  shade: false,
			  area: '600px',
			  title: '用户详情',
			  content: $('#userInfoHeader'), 
			  cancel: function(){
			  }
		});
	}
	function showApiKey(info){
		$(".api-value").html(info);
	}
	$(function(){
		// 设置高度
		$(window).resize(function() {
			if( $(".app-container").height()< $(window).height()-70 ){
				$(".app-container,.mapContainer").css("height",$(window).height()-71);
			}else{
				$(".app-container,.mapContainer").css("min-height",$(window).height()-71);
			}
		});
		
		$(".eyeApiKey").webuiPopover({
			content: '查看完整APIKEY' ,
			placement:'top',
			trigger:'hover',
			style:'inverse',
			padding:false});
		
		if( $(".app-container").height()< $(window).height()-70 ){
			$(".app-container,.mapContainer").css("min-height",$(window).height()-71);
		}else{
			$(".app-container,.mapContainer").css("min-height",$(window).height()-71);
		}
		
		$(".dropdown-hover").click(function(e){$(".profile-detail-ul").toggle();e.stopPropagation();})
		$(document).click(function(){			if(!$(".profile-detail-ul").is(":hidden")){				$(".profile-detail-ul").toggle();						}})
	//	$(".menuList .menu").eq($("span.active.hide").html()).addClass("active");
		$(".menuList .menu[tag='"+ $("span.active.hide").html() +"']").addClass("active");
		
		getAlarmCount();
		
		function getAlarmCount(){
			postAjax(localUrl+"/alarm/unread", {iot_alarm_process_status:46},function(data){
				if( isOK(data) ){
					if(data.count!=0)
						$(".alarm_num").html(data.count);
				}
			})			
		}
		
		// 报警消息定时刷新
		setInterval(function(){
			getAlarmCount();
		}, 1*30*1000);
	
		$(document).delegate(".limiter","click",function(){
			layer.tips($(this).attr("tag") , this, {
				tips: [1, '#4682B4']
			});
		})
	})
	function showNodata(selector,height){
		$(selector).html($("#template-nodata").html().format(height));
	}
	
</script>